<template>
    <div class="demo-collapse">
        <el-collapse v-model="activeNames" @change="handleChange">
            <el-collapse-item title="解题思路" name="thinking">
                <div>
                    <div>
                        以从小到大排序为例，冒泡排序法的思路是：
                    </div>
                    <div>
                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;遍历原始数据，从第一个数开始，到倒数第二个数结束，比较这个数和下一个数的大小，
                        如果这个数比下一个数大，则交换这两个数。这样便可以将数据中最大的数转移到数组的最后。
                    </div>
                    <div>
                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;之后再次遍历原始数据，但是变为从第一个数开始，到倒数第三个数结束，比较这个数和下一个数的大小，
                        如果这个数比下一个数大，则交换这两个数。这样便可以将第二大的数转移到数组的倒数第二位。
                    </div>
                    <div>
                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;重复执行上述过程，一直到从第一个数开始，到第二个数结束，从而完成了排序过程。
                    </div>
                    <div>
                        小结：
                    </div>
                    <div>
                        设总的元素个数为n，那么由上边的排序过程可以看出：
                    </div>
                    <div>
                        （1）总计需要进行（n-1）轮排序，也就是（n-1）次大循环<br>
                        （2）每轮排序比较的次数逐轮减少<br>
                        （3）如果发现在某趟排序中，没有发生一次交换， 可以提前结束冒泡排序。<br>
                        （4）冒泡排序法过程并不包括原始数据的存储过程，所以空间复杂度是 O(1)而不是O(n)。
                    </div>
                </div>
            </el-collapse-item>
            <el-collapse-item title="代码实现" name="code">
                <!-- <el-image style="width:100%" :src="url" :fit="fit" loading="lazy"></el-image> -->
                <div v-highlight>
                    <div>C/C++:</div>
                    <pre class="language-javascript">
                      <code>
                        //头文件
                        #include &lt;vector>
                        using namespace std;
                        //从小到大排序
                        void bubbleSort_MinToMax(vector&lt;int> &numberList)
                        {
                            int N = numberList.size();
                            for (int i = 1; i &lt; N; i++)
                            {
                                for (int j = 0; j &lt; N - i; j++)
                                {
                                    if (numberList[j] > numberList[j + 1])
                                    {
                                        //交换
                                        int buffer = numberList[j];
                                        numberList[j] = numberList[j + 1];
                                        numberList[j + 1] = buffer;
                                    }
                                }
                            }
                        }
                                      
                      </code>
                    </pre>
                </div>
                <div v-highlight>
                    <div>Python:</div>
                    <pre class="language-javascript">
                        <code>
                            import random 
                            # 随机生成100个1~100之间的整数值
                            random_arr = [random.randint(1,100) for n in range(100)]
                            def bubble_sort(arr):
                            """
                            冒泡排序函数，将输入的数组 arr 排序后返回
                            """
                            n = len(arr)
                            # 遍历整个数组
                            for i in range(n):
                             # 每次遍历只处理未排序的部分
                                for j in range(0, n-i-1):
                                    # 如果前一个元素比后一个元素大，则交换它们的位置
                                    if arr[j] > arr[j+1]:
                                        arr[j], arr[j+1] = arr[j+1], arr[j]
                            return arr
                            if __name__ == "__main__":
                            print(bubble_sort(random_arr))  
                        </code>
                    </pre>
                </div>
                <div v-highlight>
                    <div>Java:</div>
                    <pre class="language-javascript">
                      <code>
                        public class demo_sort {
                            public static void main(String[] args) {
                                //冒泡排序算法
                                int[] numbers=new int[]{1,5,8,2,3,9,4};
                                //需进行length-1次冒泡
                                for(int i=0;i&lt;numbers.length-1;i++)
                                {
                                    for(int j=0;j&lt;numbers.length-1-i;j++)
                                                        {
                                        if(numbers[j]>numbers[j+1])
                                        {
                                            int temp=numbers[j];
                                            numbers[j]=numbers[j+1];
                                            numbers[j+1]=temp;
                                        }
                                    }
                                }
                                System.out.println("从小到大排序后的结果是:");
                                for(int i=0;i&lt;numbers.length;i++)
                                    System.out.print(numbers[i]+" ");
                            }
                        } 
                      </code>
                    </pre>
                </div>
            </el-collapse-item>
        </el-collapse>
    </div>
</template>

<script lang="ts" setup>
import { ref } from 'vue'
// 代码实现部分
import "vue-code-highlight/themes/prism-solarizedlight.css";
import "vue-code-highlight/themes/window.css";
// const url='../assets/code/汉诺塔.png'
const activeNames = ref(['thinking'])
const handleChange = (val: string[]) => {
    console.log(val)
}


</script>
